<template>
  <div class="empty">
    <div class="img">
      <img :src="getSrc" alt="空" />
    </div>
    <div class="title">{{ title }}</div>
  </div>
</template>
<script>
export default {
  props: {
    img: {
      type: String,
      default: ""
    },
    title: {
      type: String,
      default: ""
    }
  },
  computed: {
    getSrc() {
      if (this.img) {
        return `/img/empty-${this.img}.png`;
      }
      return "/img/empty.png";
    }
  }
};
</script>
<style lang="scss" scoped>
.img {
  text-align: center;
  font-size: 0;
  img {
    width: 80%;
  }
}
.title {
  padding: 15px 0;
  font-size: 16px;
  color: #000;
  text-align: center;
}
</style>
